@extends('layouts.layouts')
@section('title')
    <title>后台首页</title>
    <style>
        .file {
            position: relative;
            display: inline-block;
            background: #D0EEFF;
            border: 1px solid #99D3F5;
            border-radius: 4px;
            padding: 4px 12px;
            overflow: hidden;
            color: #1E88C7;
            text-decoration: none;
            text-indent: 0;
            line-height: 20px;
        }
        .file input {
            position: absolute;
            font-size: 100px;
            right: 0;
            top: 0;
            opacity: 0;
        }
        .file:hover {
            background: #AADFFD;
            border-color: #78C3F3;
            color: #004974;
            text-decoration: none;
        }
    </style>
@endsection
@section('content')
    <link href="/lib/ueditor/themes/default/css/umeditor.css" type="text/css" rel="stylesheet">
    <script type="text/javascript" charset="utf-8" src="/lib/ueditor/umeditor.config.js"></script>
    <script type="text/javascript" charset="utf-8" src="/lib/ueditor/umeditor.min.js"></script>
    <script type="text/javascript" src="/lib/ueditor/lang/zh-cn/zh-cn.js"></script>
    <script src="/js/upload.js" type="text/javascript"></script>
    <script src="/js/mobileBUGFix.mini.js" type="text/javascript"></script>
    <link href="/css/ueditor.css" type="text/css" rel="stylesheet">
    <div class="content">
        <div class="header">
            <ul class="breadcrumb">
                <li><a href="/wechatSet/list">列表</a> </li>
                <li class="active">关键词设置</li>
            </ul>
        </div>
        <div class="main-content">
            <ul class="nav nav-tabs nav-tabs-course">
                <li role="presentation" class="course_add active"><a href="javascript:void(0);">关键词设置</a></li>
                <!--<li role="presentation" class="course_hour_add"><a href="javascript:void(0);">被关注回复</a></li>-->
            </ul>

            <form class="form-horizontal" id="courseFormInfo" action="/wechatSet/postKeywordSet" method="post" enctype="multipart/form-data">
          <!--   <form class="form-horizontal" id="courseFormInfo" action="/wechat/uploadMedia" method="post"> -->
                {{csrf_field()}}
                <div class="course_class row">
                    <div class="col-md-8">
                        <br>
                        <div class="tab-content childMenu" id="menuId">
                            <div class="form-group">
                                <label for="inputEmail3" class="col-sm-3 control-label">关键字</label>
                                <div class="col-sm-6">
                                    <input type="text" class="form-control" id="inputEmail3" name="keyword" placeholder="关键字"><br/>
                                </div>
                            </div>
                            <div class="form-group">
                                    <label for="inputPassword3" class="col-sm-3 control-label">添加永久素材(选填)</label>
                                    <div class="col-sm-9">
                                        <a href="javascript:;" class="file">上传素材
                                            <input type="file" id="file" class="upload_img cover" name="img_url" onchange="changepic(this)" placeholder="封面图">
                                        </a><br/>
                                        <img src="" id="show" width="200"/>
                                        <span id="error_img_size" style="color:red;"></span>
                                    </div>
                                </div>
                            <div class="form-group">
                                <label for="inputEmail3" class="col-sm-3 control-label">回复内容</label>
                                <div class="col-sm-9">
                                    <textarea type="text/plain" name="content" style="width:600px;height:160px;" placeholder="回复内容"></textarea>
                                </div>
                            </div>
                        </div>
                    </div>
                    <p>
                        <button type="submit" class="btn btn-primary btn-lg col-md-offset-5" style="width:120px;background:#286090;color:#fff;">提交</button>
                    </p>
                </div>

            </form>

        </div>

        <script src="/js/course.js"></script>
        <script src="/lib/jquery.validate.js" type="text/javascript"></script>

        <script>

            $("#courseFormInfo").validate({
                onsubmit: true,// 是否在提交是验证
                submitHandler: function (form) {

                    var keyword = $("input[name = 'keyword']").val();
                    var content = $("input[name = 'content']").val();
                    if(keyword == ''){
                        swal("关键字未填写!");
                        return false;
                    }
                    if(content == ""){
                        swal("回复内容未填写");
                        return false;
                    }

                    form.submit();
                }
            });
function changepic() {
    var reads= new FileReader();
    f=document.getElementById('file').files[0];
    reads.readAsDataURL(f);
    reads.onload=function (e) {
        document.getElementById('show').src=this.result;
    };
}

        </script>
        <style type="text/css">
            .col-sm-2{
                width:60px;
            }
            .course_content{
                margin-right: -30px;
                margin-left: -30px;
                margin-top:5px;
            }
            .btn-success{
                background-image:none!important;
            }
        </style>
@endsection